<template>
    <view class="container">
        <u-sticky offset-top="1">
            <u-tabs :lineHeight="3" @click="selectadmin" :activeStyle="xzStyle" :inactiveStyle="wxzStyle"
                :list="empist"></u-tabs>

        </u-sticky>


        <view class="search">
            <u-search class="left" placeholder="请输入管理员名称" @change="queryadmin" :bgColor="searchstyle"
                :borderColor="borderstyle" :showAction="false" v-model="keyword"></u-search>
            <view class="backtop">
                <u-button type="primary" @click="topback" class="custom-style" :plain="true" size="small"
                    text="刷新"></u-button>

            </view>


        </view>



        <view v-if="empty == 'isempty'" class="empty">
            <u-empty mode="history" icon="http://cdn.uviewui.com/uview/empty/history.png">

            </u-empty>
        </view>

        <u-loading-icon :show="loadshow" :duration="3000" text="加载中" />


        <view class="section">
            <!-- <checkbox-group   class="checkbox">
                    <label>
                        <checkbox :size="14" :checked="seletedAll" @tap="_seletedAll"></checkbox>
                    </label>

            </checkbox-group> -->
            <u-list :scrollTop="120" height="640" :style="height" :enableBackToTop="true" v-if="empty == 'notempty'"
            :preLoadScreen="page * 5" :upperThreshold="0" @scrolltolower="scrolltolower" @scrolltoupper="upper" :pagingEnabled="true">


                <u-list-item v-for="item in loglist" :key=item.id>
                    <u-swipe-action>
                        <u-swipe-action-item @click="action" :name="item.admin_id" :options="options">

                            <view class="log" @click="toInfo(item.id)">

                                <view class="info">
                                    <span>操作人 : </span>
                                    <span> {{ item.username }}</span>
                                </view>
                                <view class="info">
                                    <span>标题 :</span>
                                    <span>{{ item.title }}</span>
                                </view>
                                <view class="info">
                                    <span>时间 :</span>
                                    <span>{{ item.createtime_text }}</span>
                                </view>

                                <view class="btn2">
                                    <u-button type="error" @click="destroyone(item.id)" :plain="true" size="small"
                                        text="销毁"></u-button>

                                </view>



                            </view>

                        </u-swipe-action-item>


                    </u-swipe-action>

                </u-list-item>




                <u-loadmore :status="status" :loading-text="loadingText" :loadmore-text="loadmoreText"
                    :nomore-text="nomoreText" />


            </u-list>
            <!-- 消息提醒 -->
            <u-toast ref="notice"></u-toast>

            <!-- 模态框 -->
            <u-modal :show="show" :content="content" showCancelButton @confirm="confirm" @cancel="cancel" />
            <u-modal :show="show1" :content="content1" showCancelButton @confirm="confirm1" @cancel="cancel1" />
            <u-modal :show="show2" :content="content2" showCancelButton @confirm="confirm2" @cancel="cancel2" />

        </view>

    </view>
</template>

<script>
import pickRegions from "@/components/pick-regions/pick-regions.vue";
export default {
    components: { pickRegions },
    onLoad() {
        this.auth = this.$u.auth.check();
        this.list();
        this.emplist();
        this.pass = true

    },
    data() {
        return {
            empty: "",
            logid: 0,

            content1: "是否销毁全部日志",
            content2: "是否销毁该管理员所有日志",
            content: "是否删该日志",
            status: 'loadmore',
            loadingText: '努力加载中',
            loadmoreText: '下拉加载更多',
            nomoreText: '没有更多数据了',
            loadshow: false,
            page: 1,
            show1: false,
            show2:false,
            empid: 0,
            searchstyle: "#ffffff",
            borderstyle: "#eee",
            keyword: "",
            options: [

                {
                    text: "销毁",
                    style: {
                        backgroundColor: '#f9ae3d',
                        height: "110px",
                        marginTop: "20px",



                    },
                },
                {
                    text: "销毁",
                    style: {
                        backgroundColor: "#f56c6c",
                        height: "110px",//右侧按钮的样式
                        marginTop: "20px",


                    },
                },
            ],
            loglist: [],
            ispass:true,//方法
            ipAddress: "",
            BtnStyle: {
                with: "25px"
            },
            searchstyle: "#ffffff",
            borderstyle: "#eee",
            empist: [],
            auth: {},
            keyword: "",
            name: "",
            show: false,
            adminid: 0,
            wxzStyle: {
                FontSize: "19px",
                color: "#888888"
            },
            xzStyle: {
                FontSize: "19",
                transform: 'scale(1.2)'


            }
        };
    },
    computed: {},
    methods: {
        async actionlist() {
            let data = {
                adminid: this.auth.id,
                empid: this.empid,
                page: this.page,
            }
            this.loadshow = false
            let result = await this.$u.api.admin.action(data);

            if (result.code) {
                if (result.data.action == "isempty") {
                    this.loadshow = false

                    this.empty = "isempty"
                    // this.status = "nomore"



                } else {
                    this.empty = "notempty"

                    this.loglist = []
                    this.loglist = this.loglist.concat(result.data.action)
                    this.loadshow = false

                }
            }



        },
        async list() {
            let data = {
                adminid: this.auth.id,
                empid: this.empid,
                page: this.page,
                keyword: this.keyword,
            };
            this.loadshow = false


            let result = await this.$u.api.admin.emplog(data);
            if (result.code) {




                if (Array.isArray(result.data) && result.data.length > 0) {
                    this.loadshow = false

                    this.status = "loadmore"
                    this.empty = "notempty"

                    this.loglist = result.data



                } else {
                    this.status = "nomore"



                }
            }
        },
        async emplist() {
            let result = await this.$u.api.admin.adminlist();
            if (result.code) {
                this.empist = result.data.map((item) => {
                    // 循环遍历数据，组装自己想要的key,value把结果return出去
                    return {
                        id: item.id, name: item.username, badge: {
                            value: item.total_text,
                        }
                    };
                });

                // 做一个数组对象反转让全部排在第一
                // this.branklist = this.branklist.sort((a, b) => a.brand_id - b.brand_id).reverse();
            }
        },
        scrolltolower() {

            console.log("下拉加载")  

            this.loadshow = true

            setTimeout(() => {
                this.status = "loading"
            }, 1200)


            this.page++
            this.list()



        },
        upper()
        {
            console.log("上拉加载")  
            return false
            this.loadshow = true

            setTimeout(() => {
                this.status = "loading"
            }, 1200)


            this.page++
            this.list()
        },
        //选择管理员
        async selectadmin(e) {
            this.keyword = ""

            this.page = 1
            this.empid = e.id,


                this.actionlist()

            this.loadshow = true

        },
        async queryadmin(e) {
            this.keyword = e

            this.list()

        },
        action(item) {
            // 部分销毁

            if (item.index == 0) {
                this.show2 = true
                this.empid = item.name



            }
            // 全部销毁
            if (item.index == 1) {
                this.show1 = true
            }

        },
        destroyone(e) {
            this.logid = e
            this.show = true

             this.pass = false
      // 执行 myMethod 方法的代码
        },
        async topback() {

            let data = {
                page: 1,
                empid: this.empid,
                adminid: this.auth.id
            }
            let result = await this.$u.api.admin.emplog(data);

            this.loadshow = false


            if (result.code) {




                if (Array.isArray(result.data) && result.data.length > 0) {
                    this.empty = "notempty"

                    this.loglist = []
                    this.loglist = this.loglist.concat(result.data)


                    // this.loadshow = false

                } else {
                    this.status = "nomore"

                }

            }
        },
        async toInfo(e) {


            if(this.pass == true)
            {
                this.$u.route(
                `/pagesB/employee/permission/log/info`, {
                empid: e,

            })
            }
       
        },

        cancel() {
            this.show = false
            this.pass = true
        },
        cancel1() {
            this.show1 = false
        },
        cancel2() {
            this.show2 = false
        },
        async confirm() {

            this.show = false

            var data = {
                adminid: this.auth.id,
                logid: this.logid
            }


            var result = await this.$u.api.admin.dellog(data)

            if (result.code) {
                this.$refs.notice.show({
                    type: "success",
                    message: result.msg,
                    duration: 2000,

                })
                setTimeout(() => {
                    this.list();
                    this.emplist();

                },550)

                this.pass = true




            } else {
                this.$refs.notice.show({
                    type: "error",
                    message: result.msg,
                    duration: 2500
                })
            }

        },
        async confirm2() {

            this.show2 = false

            var data = {
                adminid: this.auth.id,
                empid: this.empid
            }

            var result = await this.$u.api.admin.dellog(data)

            if (result.code) {
                this.$refs.notice.show({
                    type: "success",
                    message: result.msg,
                    duration: 2500,

                })
                // setTimeout(() => {
                //     this.list();
                //     this.emplist();

                // },550)
                uni.reLaunch({
                    url: "/pagesB/employee/permission/log/index"
                })

                this.pass = true




            } else {
                this.$refs.notice.show({
                    type: "error",
                    message: result.msg,
                    duration: 2500
                })
            }

        },
        // 确定销毁所有日志
        async confirm1() {

            this.show1 = false

            let data = {
                adminid: this.auth.id,
            }

            var result = await this.$u.api.admin.dellog(data)

            if (result.code) {
                this.$refs.notice.show({
                    type: "success",
                    message: result.msg,
                    duration: 2500,

                })
                // setTimeout(() => {
                //     this.list();
                // }, 350)

                uni.reLaunch({
                    url: "/pagesB/employee/permission/log/index"
                })

            } else {
                this.$refs.notice.show({
                    type: "error",
                    message: result.msg,
                    duration: 2500
                })
            }

        },
    },
};
</script>

<style scoped lang="scss">
.section {
    margin: 60px 0px;
}




.search {
    width: 80%;
    position: fixed;
    top: 8%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    left: 5%;
    z-index: 999;

}

.empty {
    margin-top: 85px;
}





.btn2 {
    width: 25px;
    color: "#888";
    position: absolute;
    right: 15%;
    top: 15%;
    margin-left: 15px;
}


.backtop {
    width: 20px;
    margin-left: 15px;

    color: "blue";
}

.u-swipe-action-item__right__button{
    width: 120px;
}

.log {
    width: 88%;
    height: 115px;
    margin: 15px auto;
    position: relative;
    background: #ffffff;
    border-radius: 2%;
    border: 1px solid #eee;
    box-shadow: 2px 2px 2px #eee, 2px 2px 2px #eee;

    .info {
        width: 92%;
        padding: 5px 20px;
        display: flex;
        align-items: center;

        span:nth-of-type(1) {
            color: #888;
            padding-top: 2px;
            width: 80px;
            display: block;
        }

        span:nth-of-type(2) {
            padding-left: 10px;
            padding-top: 2px;
            overflow: hidden;
            width: 260px;
            display: block;
            white-space: nowrap;
            text-overflow: ellipsis;
            -o-text-overflow: ellipsis;
        }
    }
}
</style>